事件对象
<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<div style="width:100px;height: 100px; background-color: red "></div>
	div[style="width:100px;height:100px;background-color:red;"]
	<script type="text/javascript">
		var div = document.getElementsByTagName('div')[0];
		div.onclick = function (e){
			console.log(e);//浏览器会把事件对象打包成一个对象传到参数里去，IE浏览器下会失效，触发事件IE在window.event上记录
			var event = e || window.event;//兼容性写法，拿到事件触发的事件对象
			var target = event.target || event.srcElement;//获取事件源对象
			console.log(target); 
		}
	</script>
</body>
</html>

事件委托
利用事件冒泡，和事件源对象进行处理
优点：1.性能，不需要循环所有的元素一个个绑定事件
	 2.灵活，当有新的子元素时不需要重新绑定事件

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
	</ul>

	<script type="text/javascript">
		var ul = document.getElementsByTagName('ul')[0];
		ul.onclick = function (e) {
			var event = e || window.event;//兼容性写法，拿到事件触发的事件对象
			var target = event.target || event.srcElement;//获取事件源对象
			console.log(target.innerText); //打印对象内容
		}
	</script>
</body>
</html>